<template>
	<div class="poCustomerMine">
		<group class="salesDataDiscoveryGroup">
			<div style="margin-top: 5px; margin-bottom: 5px; z-index: 999">
				<span style="font-weight: bold; font-size: 15px; padding-left: 5px">{{title}}</span>
				<button-tab class="btnTabCustomer">
					<button-tab-item :selected="page === 'myStudent'" @on-item-click="fetchData(1)">我的学员</button-tab-item>
					<button-tab-item :selected="page === 'myPoStudent'" @on-item-click="fetchData(0)">我的试听</button-tab-item>
				</button-tab>
			</div>
		</group>
		<div v-if="page == 'myStudent'">
			<my-students-list curURL="ai/teachers/pages/getMyStudentsModel" orderBy="time" sequence="desc" :username="username" jumpToObjectDetails="customerDetails" status="1"></my-students-list>
		</div>
		<div v-else-if="page == 'myPoStudent'">
			<my-po-students-list curURL="ai/teachers/pages/getMyPoStudentsModel" orderBy="time" sequence="desc" :username="username" jumpToObjectDetails="customerDetails" status="0"></my-po-students-list>
		</div>
	</div>
</template>

<script>
	import bus from '@/event/eventBus'
	import NetWorking from '@/utils/networking'
	import myPoStudentsList from '../../../../components/mobile/scroller/scrollerMyPoStudentsList'
	import myStudentsList from '../../../../components/mobile/scroller/scrollerMyStudentsList'
	import {Group, ButtonTab, ButtonTabItem} from 'vux'
	export default {
		name: "customer",
		components: {
			Group,
			myPoStudentsList,
			ButtonTab,
			ButtonTabItem,
			myStudentsList
		},
		data() {
			return {
				title: '学员信息',
				items: [],
				username: '',
				page: 'myStudent'
			}
		},
		beforeRouteLeave(to, from, next){
			this.$store.commit('CREATE_URL_PARAMS', {name: from.name, params: this.page})
			next()
		},
		created: function () {
			bus.$emit("barController", 0)
			bus.$emit("userDefinedEvent", 1)

			this.$store.commit('FETCH_URL_PARAMS')
			if(this.$store.state.user.urlParamsMap !=null && this.$store.state.user.urlParamsMap["customer"] != null){
				this.page = this.$store.state.user.urlParamsMap["customer"].params
			}

			this.username = this.$store.state.user.userModel.sysUser.username
			if(sessionStorage.orderBy != null){
				this.orderBy = sessionStorage.orderBy
			}

			if(sessionStorage.sequence != null){
				this.sequence = sessionStorage.sequence
			}

		},
		methods: {
			fetchData: function (value) {
				switch(value){
					case 0:
						this.page = 'myPoStudent'
						break
					case 1:
						this.page = 'myStudent'
						break
					default:
						this.page = 'myStudent'
						break
				}
			}
		}
	}
</script>

<style>
	.btnTabCustomer{
		width: 180px;
		float: right;
		margin-bottom: 5px;
		margin-right: 5px;
	}

	.btnTabCustomer > .vux-button-tab-item{
		font-size: 12px;
	}

	.salesDataDiscoveryGroup > .weui-cells {
		z-index: 999;
		font-size: 17px !important;
	}

	.poCustomerMine {
		margin-top: 46px;
	}

	.poCustomerMine > .weui-grids > .weui-grid {
		padding: 10px 0px;
		text-decoration: none;
		font-size: 12px;
	}

	.memberStatusGroup > .weui-cells {
		z-index: 999;
	}
</style>